<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport"
        content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>innerText和innerHTML的区别</title>
</head>
<body>
  <div></div>
  <p>
    我是文字
    <span>123</span>
  </p>
  <script>
    // innerText 和 innerHTML的区别
    // 1. innerText 不识别html标签 非标准  去除空格和换行
    var div = document.querySelector('div')
    // div.innerText = '<strong>今天是：</strong> 2019'
    // 2. innerHTML 识别html标签 W3C标准 保留空格和换行的
    div.innerHTML = '<strong>今天是：</strong> 2019'
    // 这两个属性是可读写的  可以获取元素里面的内容
    var p = document.querySelector('p')
    console.log(p.innerText)
    console.log(p.innerHTML)
  </script>
</body>
</html>